import React from 'react'
import { history } from 'umi'
import NavBarBack from '@/components/NavBarBack/NavBarBack'
import { Footer, Button, Card } from 'antd-mobile'
import './index.less'

/**
 * 设置页面组件
 * 提供个人信息、设置密码、退出登录等功能入口
 */
export default function Setting() {
    const links = [
        {
            text: '隐私政策',
            href: '/privacyPolicy',
        },
        {
            text: '用户协议',
            href: '/userAgreement',
        },
    ]

    const onLinkClick = (item: any, index: number) => {
        history.push(item.href)
    }

    const onExit = () => {
        localStorage.removeItem('Token');
        history.push('/login');
    }

    return (
        <div style={{ padding: '46px 0' }}>
            <NavBarBack content={'设置'} style={{ maxWidth: '450px', background: '#fff', position: 'fixed', top: '0', width: '100%', zIndex: '99' }} />
            <div style={{ padding: '0 6px' }}>
                <Card>
                    <div></div>
                </Card>
                <Button onClick={() => history.push('/userInfo')} block size='large' style={{ marginTop: '10px' }}>
                    个人信息
                </Button>
                <Button onClick={() => history.push('/passwordSetting')} block size='large' style={{ marginTop: '10px' }}>
                    设置密码
                </Button>
                {/* <Button onClick={onBinding} block size='large' style={{ marginTop: '10px' }}>
                    账号绑定
                </Button> */}
                <Button onClick={onExit} block size='large' style={{ marginTop: '10px' }}>
                    退出登录
                </Button>
            </div>
            <Footer links={links} onLinkClick={onLinkClick}></Footer>
        </div>
    )
}
